<style lang="stylus" scoped>
bgBlue = linear-gradient(to right, #04befe, #4481eb);

nav {
    width: 100%;
    height: 50px;
    background: bgBlue;

    img {
        display: inline-block;
        float: left;
        width: 25px;
        height: 25px;
        margin: 12px 10px;
    }

    p {
        display: inline-block;
        width: 80%;
        float: left;
        font-size: 18px;
        color: #ffffff;
        text-align: center;
        line-height: 50px;
    }
}

img {
    display: block;
    margin: 2rem auto 3rem auto;
    width: 200px;
}

button {
    width: 92%;
    margin: 2rem 4% 5rem 4%;
    background: bgBlue;
    color: #fff;
}

.withbox {
    padding: 0 20px;
    font-size: 16px;
    color: #333;
    text-align: center;
    line-height: 2.5;

    .p1 {
        font-size: 24px;
        color: #000;
    }

    .box1 {
        text-align: left;
    }

    .note {
        font-size: 14px;
        color: #999;
        line-height: 1.8;
    }
}

.box {
    text-align: center;
    background: bgBlue;
    color #fff
    .p1 {
        font-size: 45px;
        line-height: 2;

    }
        i {
            font-size 16px
            font-style normal
            }
    .btn {
        width: 100px;
        background: #fff;
        color: #04befe;
    }
}

.list {
    display inline-block
    text-align center
    margin-top 20px
    width 100%
    li {
        display: inline-block;
        width: 33.3%;
        float: left;
    }

    .yuan {
        display: inline-block;
        width: 60px;
        height: 60px;
        border-radius: 50%;
        border: 1px solid #ddd;
    }

    i {
        display: block;
        font-style: normal;
        font-size: 16px;
        line-height 2
    }


}
</style>
<template>
    <div>
        <nav>
                <img @click="onClose" src="./imgs/icon-left.png" alt="">
                <p>合伙人</p>
        </nav>
       <div class="box">
           <p class="p1">
              {{this.$store.state.user.userBonus}} <i>元</i>
           </p>
           <p>剩余可提现奖励金额</p>
          <router-link to="/withdraw?moneyType=userBonus">
            <Button class="btn">提现</Button>
          </router-link>

        </div>
           <ul class="list">
               <li>
                 <router-link to="/wdxj">
                 <img class="yuan" src="../assets/my_user.png" alt="">
                  <i>徒弟</i>
                 </router-link>
               </li>
               <li>
                <router-link to="/wdtjr">
                  <img class="yuan" src="../assets/fzyh.png" alt="">
                    <i>上级</i>
                </router-link>
               </li>

               <li>
                <router-link to="/hhrsymx">
                  <img class="yuan" src="../assets/symx.png" alt="">
                    <i>收益明细</i>
                </router-link>
               </li>

               <li>
                <router-link to="/hhrPosList">
                  <img class="yuan" src="../assets/symx.png" alt="">
                    <i>您拥有的pos机</i>
                </router-link>
               </li>
               <!-- <li>
                 <span class="yuan"></span><i>我的激活</i>
               </li> -->
           </ul>

    </div>
</template>
<script>
export default {
  name: "withdraw",
  data() {
    return{

    }
  },
  methods:{
    onClose(){
      this.$router.back(-1)
    }
  }
};
</script>
